<template>
  <div>

    <el-dialog title="短信收费设置" :visible.sync="dialogVisible" :close-on-click-modal="false" width="700px" @close="close" append-to-body>
      <div class="form-box new_form_box" v-loading="loading">
        <el-form ref="formAdd" :model="form" :inline="true" :rules="rules" label-width="90px" class="demo-ruleForm">

          <div v-for="(item,key) in form" :key="item.id">
            <div style="margin: 10px 5px;">
              <formSubTitVue :title="item.name" />
            </div>
            <el-form-item label="收短信虞豆" :prop="`${key}.shouCost`">
              <el-input v-model="item.shouCost" placeholder="请输入收短信所需虞豆数" />
            </el-form-item>
            <el-form-item label="发短信虞豆" :prop="`${key}.faCost`">
              <el-input v-model="item.faCost" placeholder="请输入发短信所需虞豆数" />
            </el-form-item>
            
          </div>

       
          <div class="center">
            <el-button @click="clearList()" v-if="this.settingId" type="danger">删除</el-button>
            <el-button @click="close()">取消</el-button>
            <el-button type="primary" @click="submitForm('formAdd')" v-loading="loading">提交</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
  </div>

</template>

<script>
import {
  addtenantPushSettings,
  getTenantPushSettingsByTenantId,
  delTenantPushSettings,
} from "@/api/system/shopManage";
import { getGameYunyingshangnoPageList } from "../../../api/gameConfig/gameList";

export default {
  name: "",
  data() {
    return {
      dialogVisible: false,
      loading: false,
      // 表单参数
      form: {},

      rules: {},
      tenantInfo: "",
      settingId: "",

      YYSlist: [],
    };
  },
  created() {},
  methods: {
    // 打开弹窗
    async open(tenantInfo) {
      this.tenantInfo = tenantInfo;
      this.dialogVisible = true;

      
      await this.getList();
    },
    // 获取 旧配置
    async getList() {
      this.tableData = [];
      this.loading = true
      const res = await getTenantPushSettingsByTenantId({
        tenantId: this.tenantInfo.tenantId,
        type: 8, //8 卡位短信收费设置
      });
      if (res.data && res.data.settingsJson) {
        this.settingId = res.data.id;
        this.form = JSON.parse(res.data.settingsJson);
      } else {
        await this.getYYSlist();
        
      }
      this.loading = false
    },
    // 获取运营商列表
    async getYYSlist() {
      const res = await getGameYunyingshangnoPageList();
      console.log("%c Line:74 🍩 res", "color:#f5ce50", res);
      if (res && res.data) {
        this.YYSlist = [...res.data];
        this.initForm();
      }
    },
    // 初始化表单
    initForm() {
      if (this.YYSlist && this.YYSlist.length) {
        const form = {};
        this.YYSlist.forEach((r) => {
          form[r.id] = {
            id: r.id,
            name:r.name,
            shouCost: "",
            faCost: "",
          };
        });
        this.form = form
      }
    },

    // 清空配置
    clearList() {
      delTenantPushSettings(this.settingId).then((res) => {
        this.$message.success(res.msg);
        this.dialogVisible = false;
      });
    },
    // 保存到后台
    save() {
      addtenantPushSettings({
        tenantId: this.tenantInfo.tenantId,
        tenantName: this.tenantInfo.tenantName,
        settingsJson: JSON.stringify(this.form),
        type: 8,
      }).then((res) => {
        this.$message.success(res.msg);
        this.dialogVisible = false;
      });
    },

    // 重置
    reset() {
      this.$refs.formAdd.resetFields();
    },

    /** 查询详情进行回显 */
    handleUpdate(row) {
      this.form = row;
    },
    submitForm(formName) {
      this.$refs["" + formName].validate((valid) => {
        if (valid) {
          this.save();
        } else {
          this.$alert("请填写完整！");
        }
      });
    },

    close() {
      this.reset();
      this.dialogVisible = false;
    },
  },
};
</script>
<style scoped lang="css">
.new_form_box{
  min-height: 500px;
}
</style>
